<template>
	<uni-nav-bar title="加注机" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
	<view class="package">{{TeamInfo.station.name}}</view>
	<scroll-view scroll-y="true" enable-back-to-top @scrolltolower="loadMore" class="scroll-box"
		:style="{ height: pageHeight + 'px' }">
		<view class="package space-between lis" style="padding:30rpx 20rpx" v-for="(item) in getFillList"
			:key='item.id'>
			<view>{{item.name}}({{item.id}})</view>
			<view>存量:{{item.count}} <uni-icons type="trash" size="20" @click="del(item.id)"></uni-icons></view>
		</view>
	</scroll-view>
	<view class="add" @click="navTo('administrator/rehydrator/addFill')">新增</view>
</template>

<script setup lang="ts">
	import { navBack, navTo } from '@/utils/navigator';
	import { ref } from 'vue';
	import { onShow } from '@dcloudio/uni-app';
	import { showLoading, errorToast, successToast } from '@/utils/prompt';
	import { toPublish } from '@mqtt';
	import { getDeliveryFillListBybuye } from '@/gql/administrator';
	import { information } from '@/stores/administrator';
	const TeamInfo = information();
	const getFillList = ref([])
	const pageHeight = ref();
	uni.getSystemInfo({
		success: function (res) {
			pageHeight.value = res.windowHeight - 180;
		},
	});
	onShow(() => {
		init()
	})
	function init() {
		showLoading('加载中');
		const payload = {
			query: getDeliveryFillListBybuye,
			variables: { delivery_id: TeamInfo.station.id },
		};
		toPublish('ql/control/getDeliveryFillListBybuye', payload,
			(obj : any) => {
				const { getDeliveryFillListBybuye } = obj.data;
				getFillList.value = getDeliveryFillListBybuye
			},
		);
	}
	function del(id : number) {
		showLoading()
		const payload = {
			fill_id: id,
			delivery_id: TeamInfo.station.id
		};
		toPublish('control/delDeliveryFill',
			payload,
			(obj : any) => {
				uni.hideLoading();
				const { code, msg } = obj;
				if (code === 1) {
					successToast(msg)
					init()
				} else {
					errorToast(msg)
				}
			}
		);
	}
</script>

<style scoped lang="less">
	.add {
		width: 480rpx;
		height: 100rpx;
		background: linear-gradient(-10deg, #2C96F9, #1B91FF);
		border-radius: 5px;
		text-align: center;
		line-height: 100rpx;
		color: #fff;
		margin: 20rpx auto;
		font-size: 32rpx;
	}

	.lis:nth-of-type(1) {
		margin-top: 0px;
	}
</style>